<template>
    <div class="app-container" v-cloak>
        <levelbar></levelbar>
        <el-form label-width="110px" class="app-content" :model="ruleForm" ref="ruleForm">
            <div class="box">
                <div class="appTitle">查看</div>
                <div class="appTop">基本信息</div>
                <div class="formCon">
                    <el-row :gutter="21">
                        <el-col :span="8">
                            <el-form-item label="考场号：">
                                <span>{{!ruleForm.fExamroomId? '--' : ruleForm.fExamroomId }}</span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row :gutter="21">
                        <el-col :span="8">
                            <el-form-item label="班级名称：">
                                <span>{{!ruleForm.fClassId? '--' : ruleForm.fClassId }}</span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </div>

                <div class="appTop">考试信息</div>
                <div class="form-content">
                    <el-table style="width: 100%" :data="tableData" border v-loading='tableLoading'>
                        <el-table-column label="考试科目" align = "center">
                            <template scope="scope">
                                <span>{{scope.row.fSubjectid  | isNull}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column label="考试时间" align = "center">
                            <template scope="scope">
                                <span>{{scope.row.sStarttime && scope.row.sEndtime? scope.row.sStarttime.substring(0, scope.row.sStarttime.length-3) + '~' + scope.row.sEndtime.substring(0, scope.row.sEndtime.length-3) : '--'}}</span>
                            </template>
                        </el-table-column>
                    </el-table>  
                </div>


            </div>
            <div class="footer">
                <el-button @click="reBack">返回</el-button>
            </div>
        </el-form>
    </div>
</template>
 
<script>
import Levelbar from '../layout/Levelbar';
import {listWisdomExamsubject} from 'api/wisdom';
import { mapGetters } from 'vuex';

export default{
    name: 'checkExamDetail',
    components: {Levelbar},
    data() {
        return {
            ruleForm: {
                fExamroomId: '',
                fClassId: ''
            },
            tableData: [],
            tableLoading: false
        }
    },
  
    computed: {
        ...mapGetters([
            'uid'
        ])
    },
    created() {
        this.searchInfo();
    },
    methods: {
        // 查询信息
        searchInfo() {
            listWisdomExamsubject(this.$route.params.id, this.$route.params.fExamId).then(response => {
                this.ruleForm.fExamroomId = response.data.content[0].fExamroomId;
                this.ruleForm.fClassId = response.data.content[0].fCreator;
                this.tableData = response.data.content;
                // //console.log(response.data);
            });
        },
        // 跳转
        reBack() {
            // this.$router.push({path: '/schoolManage/schoolManages'}); 
            this.$router.go(-1);
        }  
    
    }
}
</script>
 
<style lang="scss" scoped>
.app-container {
    position: relative;
    padding: 20px 20px 10px;
    .app-levelbar {
        height: 35px;
    }
    .el-form{
        box-shadow:  0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        -webkit-box-shadow:  0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        background:#fff;
        padding-bottom:170px;
        .appTop{
            position: relative;
            font-size: 14px;
            color: rgb(106, 85, 72);
            padding-left: 16px;
            margin: 30px 0;
            display: block;
            &::after {
                position: absolute;
                content:'';
                width: 4px;
                height: 14px;
                background: #ff5e2c;
                left: 0;
                top: 3px;
            }
        }
        .el-form-item{
            margin-top:8px;
        }
        .appTitle{
            padding-top:8px;
            text-align: center;
            font-size: 18px;
            color: #333;
            line-height: 72px;
            font-weight: bold;
            font-family: Microsoft YaHei;
            border-bottom: 1px solid #ddd;
        }
        .box{
            padding: 0px 50px 0;
            background:#fff;
        }
        .footer {
          //float: right;
          text-align: center;
          margin-top: 60px;
        }
    }
    
}
 
</style>